<include file="header" />
<body>
<div class="wraper">
    <div class="top">
        <a href="javascript:history.go(-1);" class="iconfont icon-zuo pull-left"></a>
        <span class="pull-left">立即充值</span>
        <a href="{BEESCRM::U('base/electricity/index',array('wechat_id'=>$wechat_id))}" class="iconfont icon-shouye pull-right text-right"></a>
    </div>
    <div class="margin-top">
        <p class="form-box">
            <select id="community_name">
                <option value="0">请选择所在校区</option>
	            <volist name="community" id="vo">
                    <option value="{BEESCRM:$vo.community_name}" class="cid" data-id="{BEESCRM:$vo.community_id}" data-num="{BEESCRM:$vo.community_num}">{BEESCRM:$vo.community_name}</option>
	            </volist>
            </select>
            <span class="triangle"></span>
        </p>
        <p class="form-box">
            <select id="building_name">
                <option value="0">请选择楼号</option>
            </select>
            <span class="triangle"></span>
        </p>
        <p class="form-box">
            <input value="" placeholder="请输入寝室号" id="room"/>
        </p>
    </div>
    <div class="contain-box margin-top">
        <p class="amount">充值金额</p>
        <div class="tab-prize clearfix">
            <span class="option sub-list checked" data-amount="30">30元</span>
            <span class="option sub-list" data-amount="50">50元</span>
            <span class="option sub-list" data-amount="100">100元</span>
            <p class="option other clearfix">
                <select id="number">
                    <option value="0">其他</option>
                    <option value="200">200元</option>
                    <option value="400">400元</option>
                    <option value="600">600元</option>
                    <option value="0.01">0.01元</option>
                </select>
                <span class="iconfont icon-zuo"></span>
            </p>
        </div>
    </div>
    <div class="btn-box">
        <a href="javascript:void(0);" class="btn save">确认提交</a>
    </div>
</div>
<include file="commonJS" />
<script>
    $('.tab-prize').on('click','.option',function(){
        if($(this).hasClass('other')){
            $(this).siblings().removeClass('checked');
        }
        else{
            $(this).toggleClass('checked').siblings().removeClass('checked');
        }
    });

    $('.tab-prize').on('click','.sub-list',function(){
        var str = '<option value="0" selected="selected">其他</option>'
		        +'<option value="10">10元</option>'
		        +'<option value="20">20元</option>'
	            +'<option value="30">30元</option>';
	    $('.tab-prize #number').html(str);
    });

	/*提交订单*/
	$(document).on('click','.save',function(){
		var community_name = $('#community_name').val();
		var building_name = $('#building_name').val();
		var room = $('#room').val();
		var money = $('.checked').data('amount');
		var money1 = $('#number').val();
		var order_price = 0;
		var community_num = $("#community_name").find("option:selected").data('num');
		var building_num = $("#building_name").find("option:selected").data('num');

		if(community_name == 0){
			$.alert('error','请选择生活园区');
			return false;
		}

		if(building_name == 0){
			$.alert('error','请选择楼号');
			return false;
		}

		if(!room){
			$.alert('error','请填写寝室号');
			return false;
		}

		if(money > 0 && money1 == 0){
			order_price = money;
		}else if(money1 > 0){
			order_price = money1;
		}else{
			$.alert('error','请选择充值金额');
			return false;
		}

		if(order_price == 0){
			$.alert('error','请选择充值金额');
			return false;
		}

		if(!community_num || !building_num){
			$.alert('error','该寝室号不存在');
			return false;
		}

		var info = {};
		info.community_name = community_name;
		info.building_name = building_name;
		info.community_num = community_num;
		info.building_num = building_num;
		info.room = room;
		info.order_price = order_price;
		info.flag = 1;
		$.ajax({
			'url': "/base/electricity/charge?wechat_id={BEESCRM:$wechat_id}",
			'data': info,
			'dataType':'json',
			'type': 'POST',
			'async': false,
			success: function(data) {
				if (data.status == 'S') {
					window.location.href=data.url;
				}else{
					$.alert('error',data.message);
					return false;
				}
			}
		});
    });

    $("#community_name").change(function () {
	    var id = $("#community_name").find("option:selected").data('id');
	    var build = getParams(id);
	    var options = [];
	    if(Number(build) == 0){
		    var option = '<option value="0" data-num="0">请选择楼号</option>';
		    options.push(option);
	    }else{
		    $.each(build, function (index, node) {
			    var option = '<option value="' + node.building_name+'" data-num="' + node.building_num+ '">' + node.building_name + '</option>';
			    options.push(option);
		    });
	    }
	    $("#building_name").html(options.join(''));
    });

    function getParams(id) {
	    id = id ? id : 0;
	    var result = null;
	    $.ajax({
		    url: "/base/electricity/getBuildting/wechat_id/{BEESCRM:$wechat_id}",
		    type: "post",
		    dataType: 'json',
		    async: false,
		    data: {
			    id: id
		    },
		    success: function (data) {
			    if (data.status == 'S') {
				    result = data.data;
			    }
		    }
	    });
	    return result;
    }
</script>
</body>
</html>